import React from 'react';
import { Route } from 'react-router-dom';
import { getToken } from 'utils/storage';
// 1. 新建组件AuthRoute组件
export default function AuthRoute(props) {
  // 1. 使用...结构剩余属性，类似函数的剩余参数
  const { path, component: Comp,...restProps } = props;
  return (
    <Route 
    // 2. 将剩余属性，全部分配给Route组件即可
    {...restProps}
    path={path}
      // component={Layout}
      // 1. 将componet属性改为render写法
      render={(props) => {
        // console.log('props  ----->  ', props);
        // 💥render函数一定要有返回值，返回值是一个组件
        // 2. 把原本的history等props设置给返回的组件
        // 💥一定把形参中的props，设置给返回的回族
        // 1. 有token，显示Layout进入后台页面
        if (getToken()) {
          return <Comp {...props}></Comp>;
        } else {
          // 2. 没有token，重定向到登录页
          props.history.push('/login');
        }
      }}
    ></Route>
  );
}
